<template>
  <div class="student">
    <div class="common_showBox bx">
      <div class="common_searchBox br mb14">
        <div class="searchBox longBox bx">
          <img src="static/images/search.png" alt="" srcset="">
          <input type="text" placeholder="学号/姓名" v-model="key" @keydown.13="queryBtn">
        </div>
        <span class="ml30">班级：</span>
        <div class="chooseBox bx down w180">

          <selectMk :liDataGet="classQueryData" @change="change" dataType='classQuery_name' v-if="classData.length>0"></selectMk>
        </div>

        <el-button type="primary" class="queryBtn" :loading="queryBtnFlag" @click="queryBtn">查询</el-button>

      </div>

      <div class="common_titleBox br bx">
        <div class="common_title bx">
          <div class="common_title_left">学生信息</div>
          <div class="common_title_right">
            <div class="common_title_btn" @click="openLayer()">新增</div>
            <div class="common_title_btn" @click="deletBtn()">删除</div>
            <div class="common_title_btn">
              <a href="javascript:;" download="student_template.csv">下载模版</a>
            </div>
            <div class="common_title_btn updateBtn" @click="openFile">导入信息
              <!-- <input name="file" type="file" @change="chooseFile" /> -->
            </div>
          </div>
        </div>
        <div class="common_form bx">
          <el-table ref="multipleTable" :data="studentDataList" tooltip-effect="dark" style="width: 100%;height: 100%" @selection-change="handleSelectionChange">
            <el-table-column type="selection" prop="checkFlag"></el-table-column>
            <el-table-column label="序号" prop="num" width="60"></el-table-column>
            <el-table-column prop="student_no" label="学号" width="100" show-overflow-tooltip></el-table-column>
            <el-table-column prop="student_name" label="学生姓名" show-overflow-tooltip></el-table-column>
            <el-table-column prop="class_name" label="班级名称" show-overflow-tooltip></el-table-column>
            <el-table-column prop="gender" label="性别" show-overflow-tooltip></el-table-column>
            <el-table-column prop="birthday" label="出生日期" show-overflow-tooltip></el-table-column>
            <el-table-column prop="work_status" label="属性" show-overflow-tooltip></el-table-column>
            <el-table-column prop="cellphone" label="联系电话" show-overflow-tooltip></el-table-column>
            <el-table-column prop="address" label="家庭住址" show-overflow-tooltip></el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <span class="clickBtn" @click="handleEdit(scope.$index, scope.row)">修改</span>
                <span class="clickBtn" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</span>
              </template>
            </el-table-column>
          </el-table>
          <div class="common_form_btnBox">
            <div @click="minPageFlag &&minPage()" class="common_form_btn_min" :class="{disableClick:!minPageFlag}">首页</div>

            <img :src="minPageFlag?'static/images/last.png':'static/images/lastNo.png'" alt="上一页" @click="minPageFlag &&lastPage()" class="common_form_btn_last">

            <div class="common_form_btn_num">{{page}}</div>

            <img :src="maxPageFlag?'static/images/next.png':'static/images/nextNo.png'" alt="下一页" @click="maxPageFlag &&nextPage()" class="common_form_btn_next">
            <div @click="maxPageFlag &&maxPage()" class="common_form_btn_max" :class="{disableClick:!maxPageFlag}">尾页</div>
            <div class="common_form_btn_total">总共{{totalPage}}页</div>
          </div>
        </div>
      </div>

    </div>
    <div class="common_alertBox addStudent" v-if="addStudentFlag">
      <div class="common_alertBox_header" v-if='!modifyFlag'>
        <span>新增学生</span>
      </div>
      <div class="common_alertBox_header" v-if='modifyFlag'>
        <span>修改学生</span>
      </div>
      <div class="common_alertBox_content">

        <div class="common_alertBox_li">
          <div class="common_alertBox_li_left ">
            <span class="importentIcon">学号：</span>
            <div class="chooseBox paddingInput">
              <input type="text" v-model="studentData.student_no">
            </div>
          </div>
          <div class="common_alertBox_li_right">
            <span class="importentIcon">学生姓名：</span>
            <div class="chooseBox paddingInput">
              <input type="text" v-model="studentData.student_name">
            </div>
          </div>
        </div>
        <div class="common_alertBox_li">
          <div class="common_alertBox_li_left ">
            <span class="importentIcon">性别：</span>
            <div class="chooseBox down">

              <selectMk :liDataGet="gender" @change="change" dataType='gender'></selectMk>
            </div>


          </div>

          <div class="common_alertBox_li_right">
            <span class="importentIcon">出生日期：</span>
            <div class="chooseBox  paddingInput date">

              <el-date-picker v-model="studentData.birthday" type="date" placeholder="选择日期" value-format="yyyy-MM-dd">
              </el-date-picker>
            </div>
          </div>
        </div>
        <div class="common_alertBox_li">
          <div class="common_alertBox_li_left ">
            <!-- <span class="importentIcon">班级名称：</span> -->
            <span class="importentIcon">班级：</span>
            <div class="chooseBox  down hideInput">

              <div class="maskIpnut">{{studentData.class_name}}</div>

              <selectMk :liDataGet="classData" @change="change" dataType='class_name' v-if="classData.length>0"></selectMk>
            </div>


          </div>

          <div class="common_alertBox_li_right">
            <span class="importentIcon">属性：</span>
            <div class="chooseBox down hideInput">
              <div class="maskIpnut">{{studentData.work_status}}</div>
              <selectMk :liDataGet="work_status" @change="change" dataType='work_status'></selectMk>
            </div>
          </div>
        </div>
        <div class="common_alertBox_li onlyOne">



          <div class="common_alertBox_li_right">
            <span>联系电话：</span>
            <div class="chooseBox paddingInput">
              <input type="text" v-model="studentData.cellphone">
            </div>
          </div>
        </div>
        <div class="common_alertBox_li alert_center ">
          <div class="common_alertBox_li_alert_center ">
            <span>家庭住址：</span>
            <div class="chooseBox paddingInput">
              <input type="text" v-model="studentData.address">
            </div>
          </div>

        </div>
      </div>
      <div class="common_alertBox_footer">
        <!-- <div class="common_alertBox_footer_btn sureBtn" @click="addStudentSureBtn" v-if='!modifyFlag'>保存</div> -->
        <el-button type="primary" class="common_alertBox_footer_btn sureBtn" :loading="addStudentSureFlag" @click="addStudentSureBtn"
          v-if='!modifyFlag'>保存</el-button>
        <el-button type="primary" class="common_alertBox_footer_btn sureBtn" :loading="modifySureFlag" @click="modifySureBtn" v-if='modifyFlag'>修改</el-button>
        <!-- <div class="common_alertBox_footer_btn sureBtn" @click="modifySureBtn" v-if='modifyFlag'>修改</div> -->
        <el-button type="primary" class="common_alertBox_footer_btn cancelBtn" @click="cancelBtn">取消</el-button>
      </div>
    </div>
    <div class="common_alertBox updateFilebox" v-if="updateFileFlag">
      <div class="common_alertBox_header">
        <span>导入信息</span>
      </div>
      <div class="common_alertBox_content pushFileBox" v-if="!updateFileSuccessFlag">
        <div class="common_alertBox_li_right  chooseClassBox">
          <span class="importentIcon">班级:</span>
          <div class="chooseBox  down hideInput">
            <div class="maskIpnut">{{studentData.class_name}}</div>
            <selectMk :liDataGet="classData" @change="change" dataType='class_name' v-if="classData.length>0"></selectMk>
          </div>
        </div>
        <div class="pushFile  ">{{fileData.name}}
          <input name="file" type="file" @change="chooseFile" />
        </div>

        <ul>仅支持csv格式
          <li>
            <span class="green">必填字段</span>学生名称, 学号,性别,学籍状态</li>

          <li>
            <span class="green">性别</span> 可取值:男,女,保密 </li>
          <li>
            <span class="green">学籍状态</span> 可取值:在籍,休学,毕业,转校,退学</li>

        </ul>

      </div>
      <!-- <div class="common_alertBox_content" v-if="!updateFileSuccessFlag">
          <div class="common_alertBox_li ">
              <div class="common_alertBox_li_left ">
                上传{{fileData.name}}
              </div>
              <div class="common_alertBox_li_right " style="justify-content: center">
                <span>请选择年级</span>
                <div class="chooseBox  down hideInput">
                  <div class="maskIpnut"></div>
                  <selectMk :liDataGet="classData" @change="change" dataType='class_name' v-if="classData.length>0"></selectMk>
                </div>
              </div>
            </div>
      </div> -->
      <div class="common_alertBox_footer" v-if="!updateFileSuccessFlag">
        <div class="common_alertBox_footer_btn sureBtn" @click='sureUpdateFile' :loading="sureUpdateFileFlag">确定</div>
        <div class="common_alertBox_footer_btn cancelBtn" @click='cancelBtn'>取消</div>
      </div>
      <div class="common_alertBox_content" v-if="updateFileSuccessFlag">
        <span>总共{{updateFileSuccessData.data.total}}条</span>
        <span class="green">成功{{updateFileSuccessData.data.success}}条</span>
        <span class="red">失败{{updateFileSuccessData.data.failed}}条</span>
        <div v-if="updateFileSuccessData.data.failed>0">
          <!-- <div v-for="(item, index) in updateFileSuccessData.data.failedList" class="red"> -->
          <!-- 失败原因:{{item.data}}({{item.reason}}) -->
          <div class="thead">
            <div class="th">错误信息</div>
            <div class="th">错误原因</div>
          </div>
          <div class="tbody">
            <div class="tr" v-for="(item, index) in updateFileSuccessData.data.failedList">
              <div class="td">{{item.data}}</div>
              <div class="td">{{item.reason}}</div>
            </div>
          </div>

          <!-- </div> -->
        </div>
      </div>
      <div class="common_alertBox_footer" v-if="updateFileSuccessFlag">
        <div class="common_alertBox_footer_btn sureBtn" @click='cancelBtn'>确定</div>
        <div class="common_alertBox_footer_btn cancelBtn" @click='cancelBtn'>取消</div>
      </div>
    </div>
  </div>

  </div>
</template>

<script>
  import {
    http
  } from "../../../api/config";

  export default {
    name: 'student',
    data() {
      return {
        sureUpdateFileFlag: false,
        classData: [],
        query: '',
        gender: [{
          value: '男'
        }, {
          value: '女'
        }, {
          value: '保密'
        }],
        value1: '',
        work_status: [{
          value: '在籍'
        }, {
          value: '休学'
        }, {
          value: '毕业'
        }, {
          value: '转校'
        }, {
          value: '退学'
        }],
        addStudentFlag: false,
        addStudentSureFlag: false,
        modifySureFlag: false,
        queryBtnFlag: false,
        changeIndex: 0,
        modifyFlag: false,
        page: 1,
        pagesize: 10,
        minPageFlag: false,
        maxPageFlag: true,
        totalPage: 5,
        fileData: {
          name: '选取文件'
        },
        updateFileFlag: false,
        updateFileSuccessFlag: false,
        classQuery_name: '',
        classQuery_id: '',
        updateFileSuccessData: {},
        studentDataList: [{"id":25,"student_name":"我的和名字一样长","class_id":9,"avatar":null,"class_name":"高中1年级3班","start_year":2018,"type":"3","student_no":"565","gender":"男","birthday":"2018-08-13","cellphone":"","work_status":"在籍","address":"","genderNum":"1","work_statusNum":"1","num":1},{"id":27,"student_name":"长长长长黄出哈哈哈哈哈哈哈哈哈哈哈","class_id":1,"avatar":null,"class_name":"小学1年级1班","start_year":2018,"type":"1","student_no":"5258","gender":"男","birthday":"2018-08-24","cellphone":"","work_status":"在籍","address":"","genderNum":"1","work_statusNum":"1","num":2},{"id":21,"student_name":"村上春树","class_id":1,"avatar":null,"class_name":"小学1年级1班","start_year":2018,"type":"1","student_no":"5","gender":"男","birthday":"1993-10-05","cellphone":"15816525954","work_status":"在籍","address":"东京","genderNum":"1","work_statusNum":"1","num":3},{"id":29,"student_name":"啊嘎嘎哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇哇","class_id":1,"avatar":null,"class_name":"小学1年级1班","start_year":2018,"type":"1","student_no":"456456","gender":"男","birthday":"2018-08-02","cellphone":"","work_status":"在籍","address":"","genderNum":"1","work_statusNum":"1","num":4},{"id":30,"student_name":"手动阀大啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊","class_id":1,"avatar":null,"class_name":"小学1年级1班","start_year":2018,"type":"1","student_no":"4564","gender":"男","birthday":"2018-08-24","cellphone":"","work_status":"在籍","address":"","genderNum":"1","work_statusNum":"1","num":5},{"id":20,"student_name":"张小娴","class_id":1,"avatar":null,"class_name":"小学1年级1班","start_year":2018,"type":"1","student_no":"411111111111111111111111","gender":"女","birthday":"1993-10-05","cellphone":"15816525954","work_status":"在籍","address":"江西","genderNum":"2","work_statusNum":"1","num":6},{"id":31,"student_name":"额哇啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊","class_id":1,"avatar":null,"class_name":"小学1年级1班","start_year":2018,"type":"1","student_no":"324324","gender":"男","birthday":"2018-08-24","cellphone":"","work_status":"在籍","address":"","genderNum":"1","work_statusNum":"1","num":7},{"id":28,"student_name":"的撒啊啊啊啊啊啊啊啊啊啊啊啊啊","class_id":1,"avatar":null,"class_name":"小学1年级1班","start_year":2018,"type":"1","student_no":"234","gender":"女","birthday":"2018-08-06","cellphone":"","work_status":"在籍","address":"","genderNum":"2","work_statusNum":"1","num":8},{"id":16,"student_name":"王刚","class_id":7,"avatar":null,"class_name":"高中1年级4班","start_year":2018,"type":"3","student_no":"20010","gender":"男","birthday":"2018-08-06","cellphone":"","work_status":"在籍","address":"","genderNum":"1","work_statusNum":"1","num":9},{"id":12,"student_name":"王八羊","class_id":6,"avatar":null,"class_name":"小学1年级3班","start_year":2018,"type":"1","student_no":"20008","gender":"保密","birthday":"2016-05-10","cellphone":"15000000008","work_status":"在籍","address":"","genderNum":"3","work_statusNum":"1","num":10}],
        class_name: '',
        class_id: '',
        key: '',
        studentData: {
          address: '',
          birthday: '',
          cellphone: '',
          class_name: '',
          gender: '',
          genderNum: 1,
          id: '',
          num: '',
          student_name: '',
          student_no: '',
          work_status: '在籍',
          work_statusNum: 1
        },
        multipleSelection: [],
        handleEdit(index, row) {
          ////console.log(index, row);
          this.addStudentFlag = true;
          this.modifyFlag = true;
          this.studentData = row;
          // this.classData = [{
          //   value: row.class_name
          // }]
          if (row.birthday == "0000-00-00") {
            this.studentData.birthday = '';
          }


          $('.mask').show();

        },
        handleDelete(index, row) {
          var _this = this;
          this.$confirm('此操作将永久删除' + row.student_name + ', 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {


          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除'
            });
          });
        }
      }
    },
    methods: {
      change: function (e) {
        //console.log(e)
        switch (e.dataType) {
          case 'work_status':
            this.studentData.work_status = e.val;
            this.studentData.work_statusNum = e.index;
            break;
          case 'gender':
            this.studentData.gender = e.val;
            this.studentData.genderNum = e.index;
            break;
          case 'class_name':
            this.studentData.class_name = e.val;
            this.studentData.class_id = e.id;
            break;
          case 'classQuery_name':
            this.classQuery_name = e.val;
            this.classQuery_id = e.id;
            this.class_id = e.id;
            this.changeIndex++;
            break;
          case 'query':
            this.query = e.val;
            break;
        }
      },
      chooseFile(e) {
        var _this = this
        let file = e.target.files[0];
        _this.fileData = file;




      },

      openFile() {
        this.updateFileFlag = true;
        $('.mask').show();
      },
      sureUpdateFile() {
        let param = new FormData();
        let file = this.fileData;

        let class_id = this.studentData.class_id;
        if (class_id == '') {
          this.$message({
            message: '请选择班级',
            type: 'error'
          });
          return
        } else if (file.name == '选取文件') {
          this.$message({
            message: '请选取文件',
            type: 'error'
          });
          return
        }
        param.append('class_id', class_id) // 通过append向form对象添加数据
        param.append('upload_file', file, file.name) // 通过append向form对象添加数据
        var _this = this;
        _this.sureUpdateFileFlag = true;
        let path = '' + window.location;
        path = path.split('#')[1];
        $.ajax({
          url: http.importStudent,
          type: "POST",
          data: param,
          headers: {
            'Authorization': _this.$store.state.Authorization + ',path="' + path + '"'
          },
          /**
           *必须false才会自动加上正确的Content-Type
           */
          contentType: false,
          /**
           * 必须false才会避开jQuery对 formdata 的默认处理
           * XMLHttpRequest会对 formdata 进行正确的处理
           */
          processData: false,
          success: function (data) {
            switch (data.status) {
              case 200:
                _this.updateFileSuccessData = data;
                _this.updateFileSuccessFlag = true;
                _this.studentData.class_id = '';
                _this.studentData.class_name = '请选择';
                _this.$message({
                  message: data.message,
                  type: 'success'
                });
                var page = 1;
                var pagesize = _this.pagesize;
                _this.getData(page, pagesize);
                break;
              case 400:

                _this.$message({ //失败返回
                  message: data.message,
                  type: 'error',
                  duration: 1666
                });
                break;
              case 402:

                _this.$message({ //失败返回
                  message: data.message,
                  type: 'error',
                  duration: 1666
                });
                break;
              case 500:

                _this.$message({ //失败返回
                  message: data.message,
                  type: 'error',
                  duration: 1666
                });
                localStorage.removeItem('classlist');
                localStorage.removeItem('info');
                localStorage.removeItem('token');
                _this.$router.push({
                  path: '/login'
                });
                break;
            }




            _this.sureUpdateFileFlag = false;
          },
          error: function (data) {
            _this.sureUpdateFileFlag = false;
          }
        });
      },
      queryBtn() {
        //点击查询
        if (this.key == '' && this.changeIndex == 0) {

        } else {
          this.queryBtnFlag = true;
          this.studentDataList = [];
          var page = 1;
          var pagesize = this.pagesize;
          this.getData(page, pagesize);
          this.changeIndex = 0;
        }



      },
      openLayer() {
        this.addStudentFlag = true;
        this.studentData.class_id = this.classData[0].id;
        $('.mask').show();
      },
      setTeacher() {
        this.setTeacherFlag = true;
        $('.mask').show();
      },
      deletBtn() {

        var _this = this;
        if (this.multipleSelection.length == 0) {
          this.$message({
            type: 'warning',
            message: '请选择学生'
          });
          return;
        }
        var nameStr = '';
        var idStr = '';
        this.multipleSelection.map(function (e) {
          //console.log(e)
          nameStr += e.student_name + '、';
          idStr += e.id + ','
        });
        nameStr = nameStr.substring(0, nameStr.length - 1);
        idStr = idStr.substring(0, idStr.length - 1);
        //console.log(idStr)
        this.$confirm('此操作将永久删除' + nameStr + ', 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {

        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      toggleSelection(rows) {
        if (rows) {
          rows.forEach(row => {
            this.$refs.multipleTable.toggleRowSelection(row);
          });
        } else {
          this.$refs.multipleTable.clearSelection();
        }
      },
      handleSelectionChange(val) {
        this.multipleSelection = val; //选中数据
      },
      getData(page, pagesize) { //获取数据
        let _this = this;
        _this.maxPageFlag = false;
        _this.minPageFlag = false;
        var page = page;
        var pagesize = pagesize;
        var class_id = _this.class_id;
        var key = _this.key; //关键字

      },
      nextPage() {
        var page = this.page + 1;
        var pagesize = this.pagesize;
        this.getData(page, pagesize)
      },
      lastPage() {
        var page = this.page - 1;
        var pagesize = this.pagesize;
        this.getData(page, pagesize);
      },
      minPage() {
        var page = 1;
        var pagesize = this.pagesize;
        this.getData(page, pagesize);
      },
      maxPage() {
        var page = this.totalPage;
        var pagesize = this.pagesize;
        this.getData(page, pagesize);
      },
      modifySureBtn() {

        var _this = this;
        _this.modifySureFlag = true;
        var id = _this.studentData.id;



      },
      cancelBtn() {
        this.studentData = {
            address: '',
            birthday: '',
            cellphone: '',
            class_id: '',
            class_name: '请选择',
            gender: '',
            genderNum: 1,
            id: '',
            num: '',
            student_name: '',
            student_no: '',
            work_status: '在籍',
            work_statusNum: 1
          },
          this.sureUpdateFileFlag = false;
        this.addStudentFlag = false;
        this.setTeacherFlag = false;
        this.updateFileFlag = false;
        this.updateFileSuccessFlag = false;
        this.addStudentSureFlag = false;
        this.modifyFlag = false;
        this.modifySureFlag = false;
        this.fileData = {
          name: '选取文件'
        }
        $('.mask').hide();
      },
      setTeacherSureBtn() {
        alert('保存成功')
        this.setTeacherFlag = false;
        $('.mask').hide();
      },
      trim(str) {
        return str.replace(/(^\s*)|(\s*$)/g, "");
      },
      addStudentSureBtn() {



        if (this.trim(this.studentData.student_no) === '') {
          this.$message.error('学号不能为空');
          return;
        } else if (this.trim(this.studentData.student_name) === '') {
          this.$message.error('学生姓名不能为空');
          return;
        } else if (this.trim(this.studentData.birthday) === '') {
          this.$message.error('出生日期不能为空');
          return;

        }
        var _this = this;
        _this.addStudentSureFlag = true;



      },
      getClassData() {
        var year = (new Date()).getFullYear();
        var _this = this;



      },
      keyWatch(val) { // 实时监听数据变化
        this.changeIndex++;
      }
    },
    watch: {
      key(val) { // 实时监听数据变化
        this.keyWatch(val)
      }
    },

    beforeRouteEnter(to, from, next) {
      //传给父组建值

      next(vm => {

        vm.$emit('pageName', to.name)
      });


    }
  }

</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .chooseBox {
    margin: 0;
    width: 226px;
    position: relative;
    /* padding-right: 56px; */
    box-sizing: border-box;
  }


  .campusManagementBox {
    width: 100%;
    height: 100%;
    padding-top: 98px;
    position: relative;
  }

  .campus {
    width: 100%;
    height: 100%;
    background: #fff;
    padding-top: 60px;
    position: relative;
  }

  .campusManagement_title {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 60px;
    display: flex;
    justify-content: space-between;
  }

  .campusManagement_title_left {
    font-size: 22px;
    line-height: 60px;
    font-weight: 900;
    margin-left: 10px;
  }

  .campusManagement_title_right {
    display: flex;
    align-items: center;
  }


  .campusManagement_weekName {
    position: absolute;
    left: 0;
    top: 60px;
    width: 100%;
    height: 40px;
    display: flex;
    justify-content: space-between;
    line-height: 40px;
  }

  .weekName_title {
    width: 10%;
  }

  .weekName_li {
    width: 18%;
  }

  .commonBox_courseTableBox {
    width: 100%;
    height: 100%;
    display: flex;
  }

  .commonBox_courseTable_left {
    width: 10%;
  }

  .commonBox_courseTable_right {
    width: 90%;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
  }

  .commonBox_courseTable_left_li {
    height: 16.67%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .commonBox_courseTable_right_li {
    width: 19.7%;
    height: 16%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #4db3f8;
    border-radius: 4px;
    font-size: 28px;
    color: #fff;
  }

  /* 更正 */

  .student {
    height: 100%;
  }



  .common_alertBox_content {
    padding: 0 100px;
  }

  .common_alertBox_li_right {
    width: 70%;
  }

  .common_alertBox_li_right,
  .common_alertBox_li_left {
    width: 50%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .common_alertBox.addStudent {
    width: 894px;
    height: 484px;
  }

  .common_alertBox_li_alert_center {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .common_alertBox_li_alert_center .chooseBox {
    width: 574px;
  }

  .pushFileBox {
    position: relative;

  }

  .pushFile {
    margin: 50px auto 0;
    width: 30%;
    height: 42px;
    line-height: 42px;
    font-size: 20px;
    background: #1985ce;
    border-radius: 18px;
    color: #fff;
    position: relative;

  }

  .pushFileBox input {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
  }

  .pushFileBox ul {
    text-align: left;
    border-top: 1px solid #333;
    margin-top: 10px;
    position: relative;
  }

  .pushFileBox ul li span.green {
    width: 100px;
    display: inline-block;
    text-align: right;
    margin-right: 20px;
  }

  .common_alertBox_footer {
    padding: 35px 275px;
  }

  .common_alertBox_content.updataBox {
    max-height: 300px;
    overflow: auto;
  }

  .chooseClassBox {
    width: 24%;
    position: absolute;
    left: 50%;
    top: -20%;
    transform: translate(-50%, -50%);
    z-index: 100;

  }

  .chooseClassBox .chooseBox {
    width: 178px;
  }

  /* 更正 */

</style>
